<!-- 采用html5  -->
<!DOCTYPE html>
<html>

<head>


    <meta charset="UTF-8">

    <!-- 页面显示适应移动设备 -->
    <meta name="viewport" content="width=device-width,initial-scale=1,shrink-to-fit=no">

    <title>我的APP</title>
    <link rel="stylesheet" href="resources\we-vue\style.css">
    <link rel="stylesheet" href="resources\css\font-awesome.min.css">
    <style>
        /*元素选择器*/

        html{
            height:100%;
        }
        body{
            height:100%;
            padding:0px;/*内边距*/
            margin:0px;/*外边距*/
        }
        
        /* 类选择器 */
        .my-container{
            width:100%;
            height:100%;
            background-color: #f0f0f0;
        }

        .my-title{
            font-size:55px;
            text-align: center;/*水平居中*/
            color:#CCCCCC;
            font-weight:bold;/*文字加粗*/
            text-shadow:2px 15px 10px #dddddd;
            padding-top:25%;
            padding-bottom:40px;
        }

        .my-footer{
            text-align: center;
            color:#AAAAAA;
            margin-top:80px;
        }
    
    </style>


</head>


<body>

    <!-- div ：矩形区域 -->
    <div id="app" class="my-container">


        <div class="my-title">掌上办公</div>

        <div style="padding-left:3px;padding-right:3px;box-sizing: border-box;">

            <wv-group>
                <wv-input label="帐号" placeholder="请输入帐号" v-model="emp.e_id"></wv-input>
                <wv-input label="密码" placeholder="请输入密码" type="password" v-model="emp.e_pwd"></wv-input>
            </wv-group>


            <wv-button type="primary" @click="login" style="margin-top:20px;">登录</wv-button>
            <wv-button type="default" @click="setServer" style="margin-top:20px;">设置</wv-button>

        </div>

        <div class="my-footer">版权所有 &copy;XXX软件</div>

    </div>

</body>

<script src="resources\js\vue.min.js"></script>
<script src="resources\js\jquery.min.js"></script>
<script src="resources\we-vue\index.js"></script>
<script src="resources\layer_mobile\layer.js"></script>
<script src="resources\js\my.js"></script>

<script>
    //Vue对象的作用就是渲染界面,需要绑定一个元素
    new Vue({
        el: '#app',
        data: {
            emp: {
                e_id: '',
                e_pwd: ''
            }
        },
        methods: {
            login() {
                if (this.emp.e_id == '') {
                    //Toast.fail('请输入帐号！');
                    TopTips('请输入帐号！');
                    return;
                }

                if (this.emp.e_pwd == '') {
                    //Toast.fail('请输入密码！');
                    TopTips('请输入密码！');
                    return;
                }

                //url='http://localhost:8080/myoa/login.jsp';

                

                //服务器执行操作
                Serv.operate(
                    {
                        url: '/login.jsp',
                        data: this.emp
                    },
                    () => {//箭头函数
                        
                        setTimeout(
                            ()=>{
                                //通过js向另一个页面跳转
                                window.location.href = 'home.html';
                            },
                            1000
                            
                        );
                        
                    }
                );



            },

            setServer(){
                window.location.href="set.html";
            }



        }
    });


</script>


</html>